import React, { useState } from "react";
import { useDispatch } from "react-redux";
import { add } from "./store/todolist/todolistSlice";

const Form = () => {
  const [value, setValue] = useState("");
  const dispatch = useDispatch();

  const handleChange = (e) => {
    setValue(e.target.value);
  };

  const handleClick = () => {
    console.log(value);
    dispatch(add({ _id: Date.now(), title: value }));
    setValue("");
  };

  return (
    <>
      <input type="text" value={value} onChange={handleChange} />
      <button onClick={handleClick}>新增</button>
    </>
  );
};

export default Form;
